<div class="container_wrapper customer_register_default" id="customer_register">
    <div class="mo-card-content">
        <div class="mo-header mo-header-account">
            <h1 class="header-title">
                <span>{{lang.account.title.create}}</span>
            </h1>
            <div class="header-divider"></div>
        </div>

        <form class="mo-form" id="register-form">
          <div class="plugin-container-header"></div>

            <div class="mo-form-item pub-mo-form-item-value" name="first_name">
                <div class="mo-form-item-value pub-mo-form-item-value">
                    <input class="mo-form-input" autocomplete="new-password" placeholder="{{lang.account.form.first_name}}" type="text" id="first_name" />
                    <label class="field_label" for="first_name">{{ lang.account.form.first_name }}</label>
                </div>
            </div>
            <div class="mo-form-item" name="last_name">
                <div class="mo-form-item-value pub-mo-form-item-value">
                    <input class="mo-form-input" autocomplete="new-password" placeholder="{{lang.account.form.last_name}}" type="text" id="last_name" />
                    <label class="field_label" for="last_name">{{ lang.account.form.last_name }}</label>
                </div>
            </div>
            {% if storeConfig.checkout_contact != "0" %}
            <div class="mo-form-item" name="contact">
                <div class="mo-form-item-value pub-mo-form-item-value" style="position: relative;">
                    {% if storeConfig.checkout_contact_type == '1' %}
                        <div class="checkout_contact_phone_box" style="width:110px;position: absolute;left: 0;top:0;bottom: 0;" >
                            <div style="width: 30px;height: 20px;position: absolute;right: 0;top: 16px;border-right: 1px rgba(179, 179, 179, 0.5) solid;text-align: center;"><svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="10px" height="20px" fill="#919191" p-id="8671"><path d="M163.446154 275.692308h697.107692c19.692308 0 33.476923 25.6 17.723077 43.323077L537.6 736.492308c-11.815385 15.753846-37.415385 15.753846-49.230769 0L143.753846 319.015385c-13.784615-17.723077-1.969231-43.323077 19.692308-43.323077z" p-id="8672"></path></svg></div>
                        </div>
                    {% endif %}
                    <input  {% if storeConfig.checkout_contact_type == '1' %} style="padding-left: 120px;" {% endif %} id="contact" class="mo-form-input" autocomplete="new-password" placeholder="{{ storeConfig.other_concat | default : 'Whatsapp / Skype' }}" type="text" />
                    <label  {% if storeConfig.checkout_contact_type == '1' %} style="padding-left: 110px;" {% endif %} for="contact" class="field_label">{{ storeConfig.other_concat | default : 'Whatsapp / Skype' }}</label>
                </div>
            </div>
            {% endif %}
            <div class="mo-form-item" name="email">
                <div class="mo-form-item-value pub-mo-form-item-value">
                    <input id="email" class="mo-form-input" autocomplete="new-password" placeholder="{{lang.account.form.email}}" value="{{email}}" type="text" />
                    <label for="email" class="field_label">{{ lang.account.form.email }}</label>
                </div>
            </div>
            {%- if storeConfig.customer_register_email_verify -%}
            <div class="mo-form-item" name='email_code'>
                <div class="mo-row">
                    <div class="mo-col-8">
                        <div class="mo-form-item-value pub-mo-form-item-value">
                            <input id="email_code" class="mo-form-input" autocomplete="new-password" name='email_code' placeholder="{{lang.account.form.verification_code}}" type="text" />
                            <label for="email_code" class="field_label">{{ lang.account.form.verification_code }}</label>
                        </div>
                    </div>
                    <div class="mo-col-4" style="padding-left: 20px">
                        <div class="reset-code" id="mailCode">{{lang.account.resetpassword.send}}</div>
                    </div>
                </div>
            </div>
            {%- endif -%}
            <div class="mo-form-item" name="password">
                <div class="mo-form-item-value pub-mo-form-item-value">
                    <input id="password" class="mo-form-input" autocomplete="new-password" autocomplete placeholder="{{lang.account.form.password}}" type="password" />
                    <label for="password" class="field_label">{{ lang.account.form.password }}</label>
                </div>
            </div>

            {% assign show_front_img_code_range = storeConfig.show_front_img_code_range  | strtoarray %}
            {% assign show_front_img_code = storeConfig.show_front_img_code %}
            {% for range in show_front_img_code_range %}
              {% if show_front_img_code == "1" and  range == "register" %}
              <div class="mo-form-item" name='img_code'>
                <div class="mo-row">
                  <div class="mo-col-8">
                    <div class="mo-form-item-value">
                      <input class="mo-form-input" type="text" placeholder="{{lang.comments.enter_here}} *" />
                    </div>
                  </div>
                  <div class="mo-col-4" style="padding-left: 20px">
                    <img style="width: 100%;height: 100%;" id="code" src="/code" onclick="this.src='/code?'+Math.random();" />
                  </div>
                </div>
              </div>
              {% endif %}
            {% endfor %}

            <div class="register-service">
               
            </div>
            <div id="service_eror">{{lang.customer.link_services_error}}</div>
            
            <div class="mo-form-item checkout-main register_trms">
                {% if storeConfig.checkout_subscription > 0 %}
                <label class="checkbox_label mo-checkbox" for="sub_checkbox">  
                    <input class=" mo-checkbox_input order_checkbox insurance_checkbox" type="checkbox" {% if storeConfig.checkout_subscription == "1" %}checked{% endif %} name="sub_checkbox" value="1" id="sub_checkbox"/>
                    <span class="mo-checkbox_label check_icon">{% include icon_order_checkbox %}</span>{{lang.account.create.sub}} 
                </label>
                {% endif %}

                {% get_terms %}
                {% if terms.terms_list.size > 0 %}
                <div id="transaction_terms">
                    {% for item in terms.terms_list %}
                        {% if item.show_page contains "register" and item.plan_list.size > 0 %}
                            <label class="checkbox_label mo-checkbox" for="terms_item_{{ forloop.index0 }}">  
                                <input class=" mo-checkbox_input order_checkbox insurance_checkbox" type="checkbox" {% if item.is_checked == "1" %}checked{% endif %} name="terms_item_{{ forloop.index0 }}" value="1" id="terms_item_{{ forloop.index0 }}"/>
                                <span class="mo-checkbox_label check_icon">{% include icon_order_checkbox %}</span>
                                <span class="terms_detail" data-index="{{ forloop.index0 }}">{{item.desc}} </span>
                            </label>
                        {% endif %}
                    {% endfor %}
                </div>
                {% endif %}
            </div>
            
            <div class="mo-form-item">
                <div class="mo-form-item-value">
                    <div id="register" class="main_btn form_btn">{{lang.account.create.register}}</div>
                </div>
            </div>
            <div class="mo-form-item">
                <span class="text-tip"><a href="/account/login">{{lang.account.title.log}}</a></span>
            </div>
             <div class="plugin-container-footer"></div>

        </form>

       
    </div>
</div>
{% if storeConfig.checkout_contact_type == '1'  %}
<style>

.country_phone_code{
    position: relative;
    display: inline-block;
    width: 100%;
    height: 54px;
    border-radius: 3px;
    box-sizing: border-box;
}
.country_phone_code select{
    position: absolute !important;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    color: rgba(0, 0, 0, 0);
}
.country_phone_code select option{
    color: #000;
}
.country_phone_code .country_label{
    height: 100%;
    display: flex;
    align-items: center;
    padding-left: 10px;
}
.country_phone_code .country_label img{
    width: 32px;
    height: 28px;
}
.country_phone_code .country_label .country_label-text{
    padding: 0 6px;
    font-size: 14px;
}

</style>
<script>
    {% get_countries %}
    var countries = {{ countries | json }};
    var countries_top = {{ countries_top | json }};
    function renderCountryPhoneCode(option) {
        let countryDefaultSrc = '';
        let currentPhoneCode = lang.checkout.tel_area_code;
        const countryCode = option.countryCode || _GET_C_SETTING_('client_country');
        const phoneAreaCode =  option.phoneAreaCode;
        const options = Object.keys(countries).map(key => {
        const el = countries[key]
        var value = `${el.country_code_2}_${el.tel_area_code}`;
        {% comment %} 更具区号选中 如果没有区号默认选中国家 {% endcomment %}
        if((phoneAreaCode && phoneAreaCode == value) || (countryCode.toLocaleUpperCase() === el.country_code_2.toLocaleUpperCase() && !phoneAreaCode)){
            countryDefaultSrc = `${_GET_C_SETTING_('imgcdn')}/statics/country/flag/${el.country_code_2.toLowerCase()}.png`;
            currentPhoneCode = `+${el.tel_area_code}`
            return `<option selected="selected" data-country="${el.country_code_2}" value="${value}">(+${el.tel_area_code})${el.country_name}</option>`
        }
        return `<option value="${value}" data-country="${el.country_code_2}">(+${el.tel_area_code})${el.country_name}</option>`
        }).join("")
        
        let countriesTopOptions = Object.keys(countries_top).map(key => {
        const el = countries_top[key]
        var value = `${el.country_code_2}_${el.tel_area_code}`;
        return `<option value="${value}" data-country="${el.country_code_2}">(+${el.tel_area_code})${el.country_name}</option>`
        }).join("")
        if(Object.keys(countries_top).length){
        countriesTopOptions+=`<option data-v-2a7f170c="" value="-" disabled="disabled" >--------------</option><option data-v-2a7f170c="" value="" disabled="disabled">${lang.checkout.tel_area_code}</option>`;
        }
        $(option.el).prepend(`
        <label class='country_phone_code' >
                <div class='country_label'>
                    <img src="${countryDefaultSrc}" style="${!countryDefaultSrc ? 'display: none;':''}" />
                    <span class="country_label-text">${currentPhoneCode}</span>
                </div>
                <select name="${option.name}"  class="country_phone_code_select" style="opacity: 0;" ><option  value="0" disabled data-country="">${lang.checkout.area_empty}</option>${countriesTopOptions}${options}</select>
        </label>
        `)
    
        function setSelectTelCodeLabel(){
        const selectNode = $(option.el).find(".country_phone_code_select");
        const selectedOptionText = selectNode.find("option:selected").text();
        const value = selectNode.find("option:selected").data('country');
        const countrySrc = `${_GET_C_SETTING_('imgcdn')}/statics/country/flag/${value.toLowerCase()}.png`;
        const phoneCode = selectNode.val().replace(/.*?_/g, '');
        $(option.el).find(".country_label img").attr("src", countrySrc).show();
        $(option.el).find(".country_label .country_label-text").html(`+${phoneCode}`);
        selectNode.removeClass('top-border');
        selectNode.siblings('.tip').remove();

        }

        $(option.el).find(".country_phone_code_select").change(function () {
        setSelectTelCodeLabel();
        })
        if(!$(option.el).find(`[name="${option.name}"]`).val()){
        $(option.el).find(`[name="${option.name}"] option:first`).prop("selected", true);
        }
        setSelectTelCodeLabel();

        return {
        setPhoneCodeValue:function(val){
            if(val){
            $(option.el).find(".country_phone_code_select").val(val);
            setSelectTelCodeLabel();

            }
        }
        }
    }
  
    renderCountryPhoneCode({
        el:".checkout_contact_phone_box",
        phoneAreaCode:"",
        countryCode:"",
        name:"checkout_contact_phone_code"
    })
    function oemValidationPhone(phone,countryCode){
        const countryVerifiedPhone={"US":{rule:/^\d{10}$/,examples:"2015550123"},"GB":{rule:/^\d{10,11}$/,examples:"7400123456"},"DE":{rule:/^\d{10,12}$/,examples:"15123456789"},"AU":{rule:/^\d{9,10}$/,examples:"412345678"},"ES":{rule:/^\d{9,10}$/,examples:"612345678"},"FR":{rule:/^\d{10}$/,examples:"0612345678"},"IT":{rule:/^\d{10,11}$/,examples:"3123456789"},"CA":{rule:/^\d{10}$/,examples:"5062345678"},"NL":{rule:/^\d{9,10}$/,examples:"612345678"},"IE":{rule:/^\d{9,10}$/,examples:"850123456"},"PT":{rule:/^\d{9,10}$/,examples:"912345678"},"SE":{rule:/^\d{9,10}$/,examples:"701234567"},"GR":{rule:/^\d{10,11}$/,examples:"6912345678"},"BE":{rule:/^\d{9,10}$/,examples:"470123456"},"NZ":{rule:/^\d{9,10}$/,examples:"211234567"},"AT":{rule:/^\d{9,11}$/,examples:"664123456"},"PL":{rule:/^\d{9,10}$/,examples:"512345678"},"ZA":{rule:/^\d{9,10}$/,examples:"711234567"},"KR":{rule:/^\d{10,11}$/,examples:"1020000000"},"CH":{rule:/^\d{9,10}$/,examples:"781234567"},"TR":{rule:/^\d{10,11}$/,examples:"5012345678"},"RO":{rule:/^\d{9,10}$/,examples:"712034567"},"HU":{rule:/^\d{9,10}$/,examples:"201234567"},"HR":{rule:/^\d{9,10}$/,examples:"921234567"},"CZ":{rule:/^\d{9,10}$/,examples:"601123456"},"RS":{rule:/^\d{9,10}$/,examples:"601234567"},"BG":{rule:/^\d{8,9}$/,examples:"43012345"},"NO":{rule:/^\d{8,9}$/,examples:"40612345"},"SA":{rule:/^\d{9,10}$/,examples:"512345678"},"AE":{rule:/^\d{9,10}$/,examples:"501234567"},"CN":{rule:/^\d{11}$/,examples:"18589288872"}};
        phone = $.trim(phone);
        if(!phone){
            return lang.checkout.please_enter_phone
        }
        var countryVerified = countryVerifiedPhone[countryCode.toUpperCase()] || {rule:/^\d{7,16}$/,examples:lang.checkout.phone_not_valid};

        if(!countryVerified.rule.test(phone)){
            if(!countryVerifiedPhone[countryCode.toUpperCase()]){
                return countryVerified.examples
            }
            return lang.checkout.example_phonenumber.replace('{example_number}',countryVerified.examples)
        }
      
        return ""
    }
</script>
{% endif %}



<script type="text/javascript">
    {% if terms.terms_list.size > 0 %}
    function verifyTerms() {
        let termsChecked = true;
        $('#transaction_terms input[type=checkbox]').each(function() {
            if (!$(this).prop('checked')) {
                $(this).parent().addClass("error_label");
                termsChecked = false;
            }
        });
        return termsChecked;
    };    
    (function() {
        let terms = {{ terms.terms_list | json }};
        $('#transaction_terms .terms_detail').on('click',function(e){
            e.preventDefault();
            let index = $(this).attr('data-index');
            let plan_list = terms[index].plan_list;
            const popupLayer = moi.popup({ load: true });
            let template = `
                <div id="terms_detail_popup">
                    <div class="terms_title">
                        <ul>
                            ${
                                plan_list.map((item,index) => {
                                    return `
                                        <li class="terms_title_item ${index == 0 ? 'active' : ''}" data-index="${index}">${item.title}</li>
                                    `
                                }).join('')
                            }
                            <li style="width:200px;flex-shrink:0"></li>
                        </ul>
                        <div class="terms_close_btn">
                            <svg class="oemui-header-claer" t="1634191042040" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3072" width="20" height="20">
                                <path d="M571.008 511.936l313.088-311.04a42.688 42.688 0 0 0 0-58.816l-2.496-2.496a40.384 40.384 0 0 0-56.704 0l-313.088 313.6-313.088-311.04a40.384 40.384 0 0 0-56.704 0l-2.496 2.496a42.688 42.688 0 0 0 0 58.816l313.088 308.608-313.088 311.04a42.688 42.688 0 0 0 0 58.816l2.496 2.496a40.384 40.384 0 0 0 56.704 0l313.088-313.6 313.088 311.04a40.384 40.384 0 0 0 56.704 0l2.496-2.496a42.688 42.688 0 0 0 0-58.816z" fill="#1D1F21" p-id="3073">
                                </path>
                              </svg>
                        </div>
                    </div>
                    <div class="terms_content_box">${plan_list[0].content}</div>
                    <div class="terms_footer">
                        <div class="main_btn">{{ lang.account.profile_change.agree }}</div>
                    </div>
                </div>
            `
            popupLayer.addContent(template);
            $('#terms_detail_popup .terms_title li').on('click', function() {
                let index = $(this).attr('data-index');
                $(this).addClass('active').siblings().removeClass('active');
                $('#terms_detail_popup .terms_content_box').text(plan_list[index].content);
            })
            $('#terms_detail_popup .terms_close_btn').on('click',function() {
                popupLayer.close();
            })
            $('#terms_detail_popup .main_btn').on('click',function() {
                popupLayer.close();
                $(`#transaction_terms #terms_item_${index}`).prop("checked",true);
                $(`#transaction_terms #terms_item_${index}`).parent().removeClass("error_label");
            })
        })

        $("#transaction_terms input[type=checkbox]").change(function(){
            if($(this).prop("checked")){
                $(this).parent().removeClass("error_label");
            }
        })
    })();
    {% endif %}


    (function () {
        let oem_service_admin = moi.getCookie('oem_service_admin')

        function setOptionsClick() {
            $("#service-select").on("click", function () {
                if ($(this).find('.service-right').hasClass("show-options")) {
                    $(this).find('.service-right').removeClass("show-options")
                } else {
                    $(this).find('.service-right').addClass("show-options")
                }
                $(".register-service .service_option").toggle()
            })
        }
        function orderService() {
            try {
                let service_list = {{service_list | json}}
                let oem_service_customeropt = storeConfig.oem_service_customeropt
               
                service_list = service_list.filter(item => item.weight !== 0)
                if(service_list.length === 0) {
                    oem_service_admin = ""
                    return
                }
                let selectIndex = service_list.findIndex(item => item.id == oem_service_admin)
                let notFindSelectIndex = selectIndex
                let isManual = (oem_service_admin === null || notFindSelectIndex < 0) && oem_service_customeropt == "1"
                if(selectIndex < 0) {
                    let weigthArr = service_list.map(item => item.weight)
                    let maxWeigth = Math.max(...weigthArr)
                    selectIndex = weigthArr.findIndex(item => item === maxWeigth)
                }
                let seevice_select_box = `
                    <div class="service-list ${isManual ? 'manual' : ''}" id="service-select" data-id="${isManual ? '' : service_list[selectIndex].id}">
                        <div class="service_label">{{lang.checkout.link_services}}</div>
                        <div class="service-left">
                            <span class="service-img ${service_list[selectIndex].avatar !== "" ? "show_img": "show_svg"}">
                                <img src="${service_list[selectIndex].avatar}">
                                {% include icon_order_service_avatar %}
                            </span>
                            <div class="name">${service_list[selectIndex].name}</div>
                        </div>
                        <div class="service-right">
                            {% include icon_order_service_down %}
                        </div>
                    </div>
                `
                let options = ''
                service_list.forEach(item => {
                    options += `
                        <div class="service-list service-option-item" data-id="${item.id}">
                            <div class="service-left">
                                <span class="service-img ${item.avatar !== "" ? "show_img" : "show_svg"}">
                                    <img src='${item.avatar}'>
                                    {% include icon_order_service_avatar %}
                                </span>
                                <div class="name">${item.name}</div>
                            </div>
                        </div>
                        `
                })
                $(".register-service").append(`${seevice_select_box}<div class="service_option">${options}</div>`)
                if(oem_service_admin !== null && notFindSelectIndex >= 0) {
                    
                    if(storeConfig.oem_service_associationpattern != 0) {
                        setOptionsClick()
                    }else {
                        $("#service-select .service-right svg").css('display', 'none')
                    }
                   
                }else {
                    if(oem_service_customeropt != 2) {
                        setOptionsClick()
                    }else {
                        $("#service-select .service-right svg").css('display', 'none')
                    }
                }

                $(".service_option .service-option-item").on("click", function() {
                    let id = $(this).attr('data-id')
                    let selectItem = service_list.filter(item => item.id == id)
                    if(selectItem[0].avatar != "") {
                        $("#service-select img").attr("src", selectItem[0].avatar)
                        $("#service-select .service-img").removeClass('show_svg').addClass('show_img')
                    }else {
                        $("#service-select .service-img").removeClass('show_img').addClass('show_svg')
                    }
                    $("#service-select").attr("data-id", selectItem[0].id)
                    $("#service-select .name").text(selectItem[0].name)
                    $("#service-select").find('.service-right').addClass("show-options")
                    $(".register-service .service_option").toggle()
                    $('#service_eror').hide()
                    $("#service-select").removeClass('manual')
                })
                
            } catch (error) {
                console.log(error)
            }
        }

        {% if storeConfig.oem_service_customer == '1' %}
        document.addEventListener('DOMContentLoaded', () => {
            orderService()
	    })
        {% endif %}
       
        
        const rules = {
            email: [{ required: true, message: "{{lang.account.ruls.email}}" },{
                validator:function(value, rules,callback){
                    var emailPat=/^(.+)@(.+)$/;
                    var matchArray=value.match(emailPat);
                    if(!matchArray){
                        return callback("{{lang.account.ruls.email_invalid}}");
                    }
                }
            }],
            {%- if storeConfig.customer_register_email_verify -%}
            email_code: [{ required: true, message: "{{lang.account.ruls.verification_code}}" }],
            {%- endif -%}
            password: [{ required: true, message: "{{lang.account.ruls.password}}" },{
                validator:function(value, rules,callback){
                    if(value.length>15 || value.length<6){
                        return callback("{{lang.account.ruls.password_invalid}}");
                    }
                }
            }],
            {% if storeConfig.checkout_contact == '1' %}
                contact: [{ required: true, message: "{{lang.account.ruls.contact}}" },{
                    {% if storeConfig.checkout_contact_type == '1' %}
                    validator:function(value, rules,callback){
                        const contactMsg= oemValidationPhone(value,$('select[name="checkout_contact_phone_code"]').find("option:selected").data('country'));
                        if(contactMsg){
                            return callback(contactMsg);
                        }
                    }
                    {% endif %}
                }],
            {% endif %}
            first_name: [{ required: true, message: "{{lang.account.ruls.first_name}}" }],
            last_name: [{ required: true, message: "{{lang.account.ruls.last_name}}" }]
        };
        const form = moi.form("#register-form", rules);
        const checkoutUrl =  moi.getUrlParam('checkout_url') || "{{checkout_url}}" || '{{routes.account_url}}';
        $("#register").click(function () {
            let admin_id = $('.register-service #service-select').attr("data-id")
            if(admin_id === '') {
                $("#service_eror").show()
            }
            {% if terms.terms_list.size > 0 %}
            let termsPass = verifyTerms();
            {% endif %}
            if (form.allVerify() && admin_id !== '' {% if terms.terms_list.size > 0 %}&& termsPass{% endif %}) {
                const load = moi.nodeShowLoading(this);
                const params = moi.paramsValueString(form.allValue());
                {% if storeConfig.checkout_subscription > 0 %}
                const is_sub = $("#sub_checkbox").get(0).checked;
                params["is_sub"] = is_sub ? 1 : 0;
                {% endif %}
                params['admin_id'] = $('.register-service #service-select').attr("data-id")
                moi.ajax( {
                    url: "/account/register",
                    type: "post",
                    data: JSON.stringify(params),
                    complete: function () {
                        load.close();
                    },
                    success: function (data) {
                        if (!data.code) {
                            callback_sign_up();
                            callback_generate_lead();
                            moi.message({ content: '{{ lang.customers.login.registered_successfully }}',onClose(){
                                moi.href(checkoutUrl);

                            }});
                        } else {
                            $("#code").click();

                            return moi.alert({ title: data.msg });
                        }
                    }
                });
            }
        });

        {%- if storeConfig.customer_register_email_verify -%}
        const mailCode = $("#mailCode");

        let count = 60;
    
        let oldText = "";
    
    
        mailCode.click(function() {
    
            if (form.verify('email') && count === 60) {
                oldText = mailCode.html()
    
                const load = moi.nodeShowLoading(this);
                const params = moi.paramsValueString(form.allValue());
                moi.ajax({
                    url: '/account/signupemail',
                    type: 'post',
                    data: JSON.stringify({ email: params.email }),
    
                    complete: function() {
                        load.close();
                    },
                    success: function(data) {
                       
                        if (!data.code) {
                             mailCode.html(`${--count}s`)
                             mailCode.css({
                                 "cursor":"no-drop"
                             })
                            $('.reset-code').addClass('reset-code-prohibit')
                            countdown()
                        } else {
                            return moi.alert({ title: data.msg });
                        }
                    }
                })
            }
    
        });
    
    
        function countdown() {
    
            const timer = setInterval(function() {
    
                if (count <= 1) {
                    mailCode.html(oldText)
                    mailCode.css({"cursor":"pointer"})
                    $('.reset-code').removeClass('reset-code-prohibit')
                    clearInterval(timer)
                    count = 60;
                    return
                }
    
                mailCode.html(`${--count}s`)
    
            }, 1000)
    
        }
        {%- endif -%}
    })();
</script>
